<!--
  ~ Copyright 2019 Red Hat, Inc. and/or its affiliates.
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~     http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  -->

<div class="btn-group shadow p-3 mb-5 bg-white rounded" role="group">
    <button type="button" data-field="resetButton" class="btn btn-secondary">
        <span class="glyphicon glyphicon-ban-circle"></span>
    </button>
    <button type="button" data-field="decreaseButton" class="btn btn-secondary">
        <span class="glyphicon glyphicon-minus"></span>
    </button>
    <div data-field="dropDownPanelGroup" class="btn-group bootstrap-select" style="width: auto;">
        <button data-field="dropDownButton" type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" aria-expanded="false">
            <span id="dropDownText" class="filter-option pull-left zoom-selector-button-text"></span>&nbsp;<span class="bs-caret"><span class="caret"></span></span>
        </button>
        <div data-field="dropDownPanel" class="dropdown-menu open">
            <ul data-field="dropDownMenu" class="dropdown-menu inner zoom-selector-menu" role="menu">
                <!-- Here go the different levels (see ZoomLevelSelectorItem) -->
            </ul>
        </div>
    </div>
    <button type="button" data-field="increaseButton" class="btn btn-secondary" style="float:right">
        <span class="glyphicon glyphicon-plus"></span>
    </button>
</div>
